<div class="card">
    <div class="card-header">
        <button class="btn btn-primary btn-sm" id="addAdvBtn">添加广告</button>
    </div>
    <!-- /.card-header -->
    <div class="card-body" id="advTable">
        
    </div>
    <!-- /.card-body -->
    <div class="card-footer clearfix">
        <ul class="pagination pagination-sm m-0 float-right">
            <li class="page-item"><a class="page-link" href="#">«</a></li>
            <li class="page-item"><a class="page-link" href="#">1</a></li>
            <li class="page-item"><a class="page-link" href="#">2</a></li>
            <li class="page-item"><a class="page-link" href="#">3</a></li>
            <li class="page-item"><a class="page-link" href="#">»</a></li>
        </ul>
    </div>
</div>

<!-- 模态框 -->
<div class="modal fade" id="modal-default" style="display: none;" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">添加广告</h4>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="card-body">
                    <form name="advForm">
                        <div class="form-group">
                            <label for="exampleInputEmail1">标题</label>
                            <input type="text" class="form-control" name="advTitle" placeholder="请输入广告标题">
                        </div>
                        <div class="form-group">
                            <label for="exampleInputPassword1">类型</label>
                            <select class="form-control" name="advType" id="">
                                <option value="1">主图广告</option>
                                <option value="2">轮播广告</option>
                                <option value="3">边栏广告</option>
                            </select>
                        </div>

                        <div class="form-group">
                            <label for="exampleInputPassword1">链接</label>
                            <input type="text" name="advHref" class="form-control" placeholder="请输入广告连接">
                        </div>
                        <div class="form-group">
                            <label for="exampleInputPassword1">排序值</label>
                            <input type="text" name="advOrder" class="form-control" placeholder="请输入排序值">
                        </div>
                        <div class="form-group">
                            <label for="exampleInputPassword1">图片</label>
                            <input type="file"  name="advPic" class="form-control" placeholder="请上传图片">
                        </div>
                    </form>
                </div>
                <!-- 预览  -->
                <div id="preview">
                    <img src="" alt="">
                </div>
            </div>
            <div class="modal-footer justify-content-between">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" id="saveBtn">保存</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>